<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="styleFactures.css" />
<link rel="stylesheet" media="screen" type="text/css" href="tableau.css" />
</head>
<body>
	<div id="tout">
		

		<div id="header">
<label style="font-size: 50px" id="espFamille">Espace famille</label>
			<div id="headerDroite">
				<h:form>
					<h:panelGrid columns="2">
						<h:outputText style="center:left" value="#{mbConnexion.leLogin}" />
						<h:commandButton value="Déconnexion"
							action="#{mbConnexion.deconnexion}" />
						<h:outputText style="center:left" />
						<h:outputText style="center:left" />
					</h:panelGrid>
				</h:form>
			</div>



		</div>
		<div style="clear: both;"></div>
		<div id="photo">
			<img src="autreImages/classess.jpg" alt="photo" /> <img
				src="autreImages/vignette_passeport.jpg" alt="photo" /> <img
				src="autreImages/vignette_rencontre_jeunesse.jpg" alt="photo" />
			<div id="dernierePhoto">
				<img src="autreImages/vignette_vivre.jpg" alt="photo" />
			</div>
		</div>
		<div id="content">
			<ul id="menu">

				<li><a href="accueil.xhtml">Accueil</a></li>
				<li><a href="ficheEnfant.xhtml">Ma Fiche Enfant</a></li>
				<li><a href="Consulterinscriptions.xhtml">Mes Inscriptions</a>
					<ul>
						<li><a href="inscriptions.xhtml">Inscrire/Modifier</a></li>
						<li><a href="Consulterinscriptions.xhtml">Consulter
								activités</a></li>
					</ul></li>
				<li><a href="factures.xhtml">Mes Factures</a></li>
				<li><a href="contact.xhtml">Contact</a></li>
			</ul>
			<div id="milieux">
				<div id="centre">



					<fieldset id="listFacNp">
						<legend>
							<b>Factures non réglées</b>
						</legend>
						<div class="datagrid">
							<h:form id="formFactsNp">


						<h:dataTable id="listeFactsP" value="#{beanFacFam.listfactsNP}"
							var="fNP" styleClass="order-table"
							headerClass="order-table-header"
							rowClasses="order-table-odd-row,order-table-even-row">
						
							<h:column>
										<f:facet name="header">Date</f:facet>
										<h:outputText value="#{fNP.dateFacture}">
    			<f:convertDateTime type="date" pattern="dd/MM/yyyy"/>
    			</h:outputText>
    		</h:column>
									<h:column>
										<f:facet name="header">Montant</f:facet>
										<h:outputText value="#{fNP.montantGobal}"/>
    			
    		</h:column>
									<h:column>
										<f:facet name="header">Détail</f:facet>
										<h:commandLink actionListener="#{beanFacFam.detaillerFacture}"   action="facturesDetail">
										<f:attribute name="detailFact" value="#{fNP.idFacture}" />
											<h:outputText value="Détail" />
										</h:commandLink>

									</h:column>
									<h:column>
										<f:facet name="header">Edition</f:facet>
										<h:commandLink action="factures">
											<h:outputText value="Editer" />
										</h:commandLink>

									</h:column>
									<h:column>
										<f:facet name="header">Paiement</f:facet>
										<h:commandLink action="facturesPaiement">
											<h:outputText value="Payer" />
										</h:commandLink>

									</h:column>

						</h:dataTable>
					</h:form>

						</div>
					</fieldset>

					<fieldset id="listFacP">
						<legend>
							<b>Factures réglées</b>
						</legend>
						<div class="datagrid">
							<h:form id="formFactsP">


						<h:dataTable id="listeFactsNp" value="#{beanFacFam.listfactsP}"
							var="fP" styleClass="order-table"
							headerClass="order-table-header"
							rowClasses="order-table-odd-row,order-table-even-row">
						
							<h:column>
										<f:facet name="header">Date</f:facet>
															<h:outputText value="#{fP.dateFacture}">
    			<f:convertDateTime type="date" pattern="dd/MM/yyyy"/>
    			</h:outputText>
    			
    		</h:column>
									<h:column>
										<f:facet name="header">Montant</f:facet>
										<h:outputText value="#{fP.montantGobal}"/>
    			
    		</h:column>
									<h:column>
										<f:facet name="header">Détail</f:facet>
											<h:commandLink actionListener="#{beanFacFam.detaillerFacture}"   action="facturesDetail">
										<f:attribute name="detailFact" value="#{fP.idFacture}" />
											<h:outputText value="Détail" />
										</h:commandLink>
										

									</h:column>
									<h:column>
										<f:facet name="header">Edition</f:facet>
										<h:commandLink action="documents/FACTURE_MENDE_1ER_BIMESTRE.pdf">
											<h:outputText value="Editer" />
										</h:commandLink>

									</h:column>

						</h:dataTable>
					</h:form>
						</div>
					</fieldset>






				</div>
				<div style="clear: both;"></div>
			</div>
		</div>
		<div style="clear: both;"></div>
		<div id="footer">
			<img src="images/afcepfMinus.png"></img> Gepeto <img
				src="images/malakoffMinus.png" />
		</div>
	</div>
</body>
</html>
